<%@ page import="com.wfc.entity.User" %><%--
  Created by IntelliJ IDEA.
  User: aiwzy
  Date: 2022/4/16
  Time: 17:54
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>首页</title>
    <link type="text/css" rel="stylesheet" href="css/index.css">

    <link rel="stylesheet" href="css/head.css" type="text/css">
    <style type="text/css">
        .search {
            width: 150px;
            height: 40px;
            border-radius: 18px;
            outline: none;
            border: 1px solid #ccc;
            padding-left: 2px;
            position: absolute;
        }
        .btn{
            background-color: #f54967;
            width: 50px;
            height: 30px;
            color: white;
            right: 24px;
            top: 70px;
            line-height: 24px;
            border-style: none;
            position: absolute;
            outline: none;
            cursor: pointer;
            border-radius: 40%;
        }
    </style>
</head>
<body>
<script type="text/javascript">
    var http_request = "<%=request.getContextPath() %>";
</script>
<%--&lt;%&ndash;共同的顶部&ndash;%&gt;--%>
<%--<jsp:include page="head.jsp"/>--%>
<div class="head">
    <ul class="u1">
        <li><a href="index.jsp">美食天下 首页</a></li>
        <li><a href="system/dish.jsp">菜谱</a></li>
        <li><a href="system/cook.jsp">食材</a></li>
        <li><a href="#">专题</a></li>
        <li><a href="#">笔记</a></li>
        <li><a href="#">社区</a></li>
        <li><a href="#">活动</a></li>
        <li><a href="#">搜索</a></li>
    </ul>
    <a class="nr" href="#" style="    float: right;
    position: relative;
    top: -47px;
    display: block;
    font-size: 10px;
    color: #f1f1f1;
    width: 68px;
    text-align: center;
    line-height: 13px;
    background-color: #FE5761;
    height: 100%;
    text-decoration: none;
    margin-left: 0;"><img src="image/nr3.png" style="width: 18px;height: 18px;margin-top: 5px;"/><br/>客户端</a>
    <ul class="u2" style=" position: fixed;
    right: 68px;
    top: -16px;margin-right: 4px">
        <li class="pic">
            <img src="
<%--        <c:if test="${!sessionScope.user.avatar.equals('')}">--%>
        <c:if test="${!sessionScope.user.avatar.equals('')}">
        ${sessionScope.user.avatar}
        </c:if>
        <c:if test="${!sessionScope.user.avatar.equals('')}">
        https://tse2-mm.cn.bing.net/th/id/OIP-C.Z8cO0OriANaUVakbQ6n0BwAAAA?w=153&h=165&c=7&r=0&o=5&dpr=1.65&pid=1.7
        </c:if>
" onclick="jump()" style="width: 35px;height: 35px; border-radius: 45%;cursor: pointer">
            <script src="js/jquery-3.2.1.min.js"></script>
            <script type="text/javascript">
                function jump() {
                    var src = $("img")[0].src;
                    $.ajax({
                        url: http_request + "/system/member.jsp",
                        data: {
                            img: src
                        },
                        dataType: "text",
                        success: function () {
                            alert("欢迎来到个人中心！")
                            window.location.href = http_request + "/system/member.jsp"
                        },
                        error: function () {
                            alert("个人中心跳转失败！")
                        }
                    })
                }
            </script>

        </li>
        <li class="l2">
            <c:if test="${empty sessionScope.user.username}">
                <div class="d1">
                    <a href="/checkLogin">登录/注册</a>
                </div>
            </c:if>
            <c:if test="${not empty sessionScope.user.username}">
                <div class="d1">
                    <a href="system/member.jsp"
                       style="font-size: 15px; text-align: center; vertical-align: middle">${sessionScope.user.username}</a>
                </div>
            </c:if>
        </li>
        <li class="l1">
            <div><a href="system/makeCook.jsp"><img src="image/nr1.png"
                                             style="width: 18px;height: 18px;margin-top: 5px;margin-right: 2px;"/><br/>发布</a>
            </div>
        </li>
        <li class="l1">
            <div>

                <img id="a1" src="image/nr2.png"
                     style="width: 18px;height: 18px;margin-top: 5px;margin-right: 2px"/><br/>
                <span id="s1">签到有礼</span>
                <script type="text/javascript">
                    $(function () {
                        <c:if test="${not empty sessionScope.user.username}">
                        $("#a1").click(function () {
                            $("#s1").html("已签到");
                        })
                        </c:if>
                        <c:if test="${ empty sessionScope.user.username}">
                        $("#a1").click(function () {
                            alert("请您先进行登录。。。")
                        })
                        </c:if>


                    })
                </script>


            </div>
        </li>
    </ul>
</div>

<div class="sec">
    <div class="s1">
        <div class="d2">
            <a href="#" class="a1" name="abc">美食天下</a>
            <a class="a2" href="#">
                <div class="d3">菜谱</div>
            </a>
        </div>
        <div class="d3">
            <ul>
                <li><a href="" style="color: red">菜谱首页</a></li>
                <li><a href="system/category.jsp" target="_blank">分类</a></li>
                <li><a href="system/dish.jsp" target="_blank">菜单</a></li>
                <li><a href="">排行</a></li>
                <li><a href="">食材</a></li>
                <li><a href="">食疗食补</a></li>
            </ul>
        </div>
        <%
            String path = request.getContextPath();
        %>
<%--        <div class="d4" style="display: flex">--%>
<%--            <form method="get">--%>
<%--                <input type="text" id="like"  style="border-color: #ffffff;border-radius: 3px ;height: 24px;" value=""/>--%>
<%--                <input type="hidden" id="path" value="<%=path%> " style="margin-left: 60px">--%>
<%--            </form>--%>
<%--            <button style="background-color: #999999;width:50px;height: 30px; color: white;margin-left: -8px;line-height: 24px;"--%>
<%--                    onclick="fun()">搜索--%>
<%--            </button>--%>
<%--        </div>--%>
        <div class="d4" style="display: flex">
            <form method="get">
                <input type="text" id="like" class="search"  value=""/>
                <input type="hidden" id="path" value="<%=path%> " style="margin-left: 60px">
            </form>
            <button
                    onclick="fun()" class="btn">搜索
            </button>
        </div>
        <script type="text/javascript">

            function fun() {
                var like = $("#like").val();
                $.ajax({
                    url: "mohu",
                    type: "get",
                    data: {
                        like: like

                    },
                    dataType: "text",

                    success: function (data) {
                        if (data == 1) {
                            var path = document.getElementById("path").value;
                            window.location.href = path + "/system/search.jsp"
                        } else {
                            alert("查询失败")
                        }

                    },
                    error: function (data) {
                        alert("报错了")

                    }
                })
            }

        </script>
    </div>
    <hr style="border-color: #ffffff"/>
    <div class="d5">
        <ul>
            <li><a href="" style="color: red">首页</a></li>
            <li><a href="/classification?category=${"热菜"}">热菜</a></li>
            <li><a href="/classification?category=${"凉菜"}">凉菜</a></li>
            <li><a href="/classification?category=${"汤羹"}">汤羹</a></li>
            <li><a href="/classification?category=${"主食"}">主食</a></li>
            <li><a href="/classification?category=${"小吃"}">小吃</a></li>
            <li><a href="">西餐</a></li>
            <li><a href="">烘焙</a></li>
            <li><a href="">饮品</a></li>
            <li><a href="">泡菜腌菜</a></li>
            <li><a href="">自制食材</a></li>
            <li><a href="">家常菜谱</a></li>
            <li><a href="" style="margin-right: 30px;">最新菜谱</a></li>
            <li><a href="">全部菜谱分类</a></li>
        </ul>
        <hr style="border-color: #ffffff"/>
    </div>
    <div class="d6">
        <a href="http://localhost:63342/project/Day06/paihang.html?_ijt=t53k4sniemuu0tpf0eafmn9lsu&_ij_reload=RELOAD_ON_SAVE"
           target="_blank"><img src="image/r01.jpg" title="一周最热"/>一周最热</a>
        <a href="#"><img src="image/r02.jpg" title="人气菜肴"/>人气菜肴</a>
        <a href="#"><img src="image/r03.jpg" title="春季食谱"/>春季食谱</a>
        <a href="#"><img src="image/r04.jpg" title="高颜值"/>高颜值</a>
        <a href="#"><img src="image/r05.jpg" title="快手菜"/>快手菜</a>
        <a href="#"><img src="image/r06.jpg" title="早餐"/>早餐</a>
        <a href="#"><img src="image/r07.jpg" title="家族菜谱"/>家族菜谱</a>
        <a href="#"><img src="image/r08.jpg" title="烘焙大全"/>烘焙大全</a>
        <a href="#"><img src="image/r09.jpg" title="亲子专区"/>亲子专区</a>
        <a href="#"><img src="image/r10.jpg" title="所有菜谱"/>所有菜谱</a>
    </div>
</div>

<div class="d7">
    <div class="d8">
        <h3><a href="" style="color: #ff6767">最新推荐</a></h3>
        <h3><a href="">最新发布</a></h3>
        <h3><a href="categoryServlet?category=${"热菜"}">热菜</a></h3>
        <h3><a href="categoryServlet?category=${"凉菜"}">凉菜</a></h3>
        <h3><a href="categoryServlet?category=${"汤羹"}">汤羹</a></h3>
        <h3><a href="categoryServlet?category=${"主食"}">主食</a></h3>
        <h3><a href="categoryServlet?category=${"小吃"}">小吃</a></h3>
        <h3><a href="">西餐</a></h3>
        <h3><a href="">烘焙</a></h3>
        <h3><a href="" style="margin-right: 170px;">自制食材</a></h3>
        <a href="#" style="font-size: 16px;">全部分类</a>
    </div>
    <hr style="border-color: #ffffff"/>
</div>
<div class="d9">
    <ul>


        <%--分类几何显示--%>
        <c:forEach var="dish" items="${sessionScope.dishByCategory}" varStatus="id"
                   end="${sessionScope.dishByCategory.size()}">
            <li>
                <div class="d11"><img src="${dish.img}" onclick="imgJump(this)"/></div>
                <script>
                    function imgJump(e) {
                        alert(e.src)
                        $.ajax({
                            url: "canpuSelvet",
                            type: "get",
                            data: {
                                name: e.src,
                            },
                            dataType: "text",
                            success: function (data) {
                                if (data == 1) {
                                    window.location.href = http_request + "/system/cook.jsp"
                                } else {
                                    alert("查询失败")
                                }
                            },
                            error: function (data) {
                                alert("报错了")
                            }
                        })
                    }
                </script>
                <a class="a3" href="#" id="dname">${dish.dname}<br/></a>
                <a class="a4" href="#">${dish.uname}</a>
            </li>
        </c:forEach>


        <li>
            <div class="d11"><img src="image/2022031116469939643301.jpg"/></div>
            <a class="a3" href="#">家熬鲫头鱼<br/></a>
            <a class="a4" href="#">宁静致远0217</a>
        </li>
        <li>
            <div class="d11"><img src="image/2022031116469917907211.jpg"/></div>
            <a class="a3" href="#">蒜苗鸡蛋火腿肠炒饭<br/></a>
            <a class="a4" href="#">兰杏梅</a></li>

        <li>
            <div class="d11"><img src="image/2022031116469917393361.jpg"/></div>
            <a class="a3" href="#">红烧鱼<br/></a>
            <a class="a4" href="#">polaris滴食记</a></li>

        <li>
            <div class="d11"><img src="image/20220311164696833277148612901915.jpg"/></div>
            <a class="a3" href="#">韭菜鸡蛋饼<br/></a>
            <a class="a4" href="#">厨色</a></li>
        <li>
            <div class="d11"><img src="image/001.jpg"/></div>
            <a class="a3" href="#">苹果果脯<br/></a>
            <a class="a4" href="#">不做妖精好多年</a>
        </li>
        <li>
            <div class="d11"><img src="image/002.jpg"/></div>
            <a class="a3" href="#">清炖花胶汤<br/></a>
            <a class="a4" href="#">溏沁海珍花胶</a>
        </li>
        <li>
            <div class="d11"><img src="image/003.jpg"/></div>
            <a class="a3" href="#">捞汁太湖白虾<br/></a>
            <a class="a4" href="#">昊妈厨房</a>
        </li>
        <li>
            <div class="d11"><img src="image/004.jpg"/></div>
            <a class="a3" href="#">香芋紫薯奶昔<br/></a>
            <a class="a4" href="#">清水淡竹</a>
        </li>
        <li>
            <div class="d11"><img src="image/005.jpg"/></div>
            <a class="a3" href="#">芒果奇亚籽奶昔<br/></a>
            <a class="a4" href="#">哦不回家</a>
        </li>
        <li>
            <div class="d11"><img src="image/006.jpg"/></div>
            <a class="a3" href="#">梅菜蒸排骨<br/></a>
            <a class="a4" href="#">琪_feXjz8E2</a>
        </li>
        <li>
            <div class="d11"><img src="image/007.jpg"/></div>
            <a class="a3" href="#">香酥鸡中翅<br/></a>
            <a class="a4" href="#">琪_feXjz8E2</a>
        </li>
        <li>
            <div class="d11"><img src="image/008.jpg"/></div>
            <a class="a3" href="#">香煎鲰头鱼丸子<br/></a>
            <a class="a4" href="#">梅菜蒸排骨</a>
        </li>
        <li>
            <div class="d11"><img src="image/009.jpg"/></div>
            <a class="a3" href="#">莲子百合排骨汤<br/></a>
            <a class="a4" href="#">琪_feXjz8E2</a>
        </li>
        <li>
            <div class="d11"><img src="image/010.jpg"/></div>
            <a class="a3" href="#">苹果瘦肉汤<br/></a>
            <a class="a4" href="#">琪_feXjz8E2</a>
        </li>
        <li>
            <div class="d11"><img src="image/011.jpg"/></div>
            <a class="a3" href="#">快手又好吃的烧烤<br/></a>
            <a class="a4" href="#">坏脾气莲莲</a>
        </li>
        <li>
            <div class="d11"><img src="image/012.jpg"/></div>
            <a class="a3" href="#">金针菇木耳拌豆腐皮<br/></a>
            <a class="a4" href="#">—溪月</a>
        </li>
        <li>
            <div class="d11"><img src="image/013.jpg"/></div>
            <a class="a3" href="#">苦菊拌剔骨肉<br/></a>
            <a class="a4" href="#">不做妖精好多年</a>
        </li>
        <li>
            <div class="d11"><img src="image/014.jpg"/></div>
            <a class="a3" href="#">紫菜筒蒿鸡蛋饼<br/></a>
            <a class="a4" href="#">雨中漫步_kRsJPX</a>
        </li>
        <li>
            <div class="d11"><img src="image/015.jpg"/></div>
            <a class="a3" href="#">黄瓜拌猪头肉<br/></a>
            <a class="a4" href="#">雨中漫步_kRsJPX</a>
        </li>
        <li>
            <div class="d11"><img src="image/016.jpg"/></div>
            <a class="a3" href="#">生菜排骨面<br/></a>
            <a class="a4" href="#">清水淡竹</a>
        </li>
        <li>
            <div class="d11"><img src="image/017.jpg"/></div>
            <a class="a3" href="#">梦龙脆皮蛋糕卷<br/></a>
            <a class="a4" href="#">苹芊_D</a>
        </li>
        <li>
            <div class="d11"><img src="image/018.jpg"/></div>
            <a class="a3" href="#">藜麦杂菜沙拉<br/></a>
            <a class="a4" href="#">polaris滴食记</a>
        </li>
        <li>
            <div class="d11"><img src="image/019.jpg"/></div>
            <a class="a3" href="#">菌菇番茄减脂汤<br/></a>
            <a class="a4" href="#">polaris滴食记</a>
        </li>
        <li>
            <div class="d11"><img src="image/020.jpg"/></div>
            <a class="a3" href="#">家常炖排骨<br/></a>
            <a class="a4" href="#">米拉Miira</a>
        </li>
        <li>
            <div class="d11"><img src="image/021.jpg"/></div>
            <a class="a3" href="#">水煎小笼煎包<br/></a>
            <a class="a4" href="#">阳春白雪小食光</a>
        </li>
        <li>
            <div class="d11"><img src="image/022.jpg"/></div>
            <a class="a3" href="#">辣酱炒藕片<br/></a>
            <a class="a4" href="#">米拉Miira</a>
        </li>
        <li>
            <div class="d11"><img src="image/023.jpg"/></div>
            <a class="a3" href="#">家常大拌菜骨<br/></a>
            <a class="a4" href="#">孟祥磊_jW4n</a>
        </li>
        <li>
            <div class="d11"><img src="image/024.jpg"/></div>
            <a class="a3" href="#">红糖核桃馒头<br/></a>
            <a class="a4" href="#">City爱厨房</a>
        </li>
        <li>
            <div class="d11"><img src="image/025.jpg"/></div>
            <a class="a3" href="#">羊肉揪面片<br/></a>
            <a class="a4" href="#">小洞天</a>
        </li>
        <li>
            <div class="d11"><img src="image/026.jpg"/></div>
            <a class="a3" href="#">猪油清汤荞面<br/></a>
            <a class="a4" href="#">小洞天</a>
        </li>
        <li>
            <div class="d11"><img src="image/027.jpg"/></div>
            <a class="a3" href="#">家常豆腐<br/></a>
            <a class="a4" href="#">孟祥磊_jW4n</a>
        </li>
        <li>
            <div class="d11"><img src="image/028.jpg"/></div>
            <a class="a3" href="#">桂圆红枣雪梨汤<br/></a>
            <a class="a4" href="#">清水淡竹</a>
        </li>
    </ul>
    <a href="#" class="a5">
        <div class="d10">查看更多</div>
    </a>
    <hr style="border-color: #ffffff"/>
</div>

<%--共同的尾部--%>
<jsp:include page="footer.jsp"/>
<div class="f5"><a href="#abc"><img src="image/gotop.jpg" style="width: 58px;height: 58px;"/></a></div>
</body>
</html>
